<template>
    <div>
      <nav-top title="创建代理商" :show="true"></nav-top>
      <div class="totalCreateClub">
        <ul>
          <li class="clearfix">
            <div class="clearfix">
              <label class="fl">
                代理ID
              </label>
              <input type="number" class="fl agentId" placeholder="请输入游戏ID">
            </div>
            <div class="searchInfo">
              <img src="../assets/img/photo.png" alt="">
              <span></span>
            </div>
            <div class="tips" onOff="false">

            </div>
          </li>
          <li class="clearfix">
            <label class="fl">
              代理手机号
            </label>
            <input type="number" class="fl agentPhone" placeholder="请输入手机号">
          </li>
        </ul>
        <div class="agentCreateClubBtn clearfix">
          <button class="fl reset">
            重置
          </button>
          <button class="fr commit">
            提交
          </button>
        </div>
      </div>
    </div>
</template>

<script>
  import NavTop from '../components/navTop.vue'
  export default {
    components: {NavTop},
    name: '',
    data () {
      return {
        items: {}
      }
    },
    mounted: function () {

    },
    computed: {},
    filters: {},
    methods: {}
  }
</script>
<style lang="less" scoped>
  .totalCreateClub{
    padding-top:0.44rem;
    background-color: #ffffff;
    border-bottom:0.02rem solid #e8e8e8;
    ul{
      border-top:0.02rem solid #e8e8e8;
      padding:0 0.22rem;
    }
    li{
      border-bottom:0.02rem solid #e8e8e8;
      padding:0.18rem 0;
      label{
        width:2rem;
        line-height: 0.6rem;
      }
      input{
        width:4.2rem;
        height: 0.6rem;
        padding-left:0.1rem;
        border:none;
        background-color: #F2F2F4;
        box-shadow: inset 0 0px 0.03rem 0.03rem #E8E8E8;
        font-size:0.3rem;
        outline: none;
      }
      input:-ms-input-placeholder{text-align: center;}
      input::-webkit-input-placeholder{text-align: center;}
      input::-moz-placeholder { text-align: center; }
      .searchInfo{
        padding-top:0.3rem;
        text-align: center;
        display: none;
        img{
          width:1.5rem;
          height: 1.5rem;
          vertical-align: middle;
        }
        span{
          color: #aaaaaa;
        }
      }
      .tips{
        padding:0.1rem 0 0 2rem;
        font-size:0.3rem;
        color:orangered;
        display: none;
      }
    }
    .agentCreateClubBtn{
      padding:0.2rem 0.42rem;
      button{
        height:0.6rem;
        width:3rem;
        color: #fff;
        -webkit-border-radius: 0.08rem;
        -moz-border-radius: 0.08rem;
        border-radius: 0.08rem;
        outline: none;
        border:none;
      }
      .reset{
        background-color: #00B0ED;
      }
      .commit{
        background-color: #00B01e;
      }
    }
  }
</style>
